<#assign ctx=base.contextPath>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>日志列表</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<script type="text/javascript">var ctx = '${ctx}';</script>
	<link rel="stylesheet" href="${ctx}/static/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="${ctx}/static/css/news.css" media="all" />
</head>
<body class="childrenBody">
	<blockquote class="layui-elem-quote news_search">
		<div class="layui-inline">
		    <div class="layui-input-inline">
		    	<input type="text" name="keyword" value="" placeholder="请输入关键字" class="layui-input search_input">
		    </div>
		    <a class="layui-btn search_btn">查询</a>
		</div>
	</blockquote>
	<div class="layui-form news_list">
	  	<table class="layui-table">
		    <colgroup>
		    </colgroup>
		    <thead>
				<tr>
					<th>序号</th>
					<th>类型</th>
					<th>用户标识</th>
					<th>目标url</th>
					<th>参数</th>
					<th>请求方式</th>
					<th>标题</th>
					<th>ip</th>
					<th>访问时间</th>
					<th>异常</th>
				</tr>
			</thead>
		    <tbody class="news_content" id="logId">
		    	<tr v-for="(log,index) in logList">
		    		<td>{{log.id}}</td>
		    		<td>{{log.type == 1?'正常':'异常'}}</td>
		    		<td width="20%" :title="log.userAgent">{{log.userAgent.substr(0,30)+'...'}}</td>
		    		<td>{{log.uri}}</td>
		    		<td width="20%">{{log.params}}</td>
		    		<td>{{log.method}}</td>
		    		<td>{{log.title}}</td>
		    		<td>{{log.ip}}</td>
		    		<td>{{log.insertDate}}</td>
		    		<td @click="showException(log.exception)" :title="log.exception">{{log.exception.substr(0,30)+'...'}}</td>
		    	</tr>
		    </tbody>
		</table>
	</div>
	<div id="page">
	</div>
	<script type="text/javascript" src="${ctx}/static/layui/layui.js"></script>
	<script src="https://cdn.bootcss.com/vue/2.5.3/vue.min.js"></script>
	<script src="https://cdn.bootcss.com/vue-resource/1.3.3/vue-resource.min.js"></script>
</body>
<script type="text/javascript">
var page;
var layer = layui.config({
	base : "js/"
}).use(['form','layer','jquery','laypage'])
var logApp = new Vue({
	  el: '#logId',
	  methods : {
		  showException : function(con){
			  if(con.length>=30)layer.msg(con, {icon: 1,time: 3500,area:['800px','550px']}); 
		  }
	  },
	  data:{
		  logList:[]
	  },
	  created:function(){
          this.$http.get('${ctx}/log/list.json').then(function(data){
              this.logList=data.body.list;
              var logs= data;
              layui.use('laypage', function(){
	           	  var laypage = layui.laypage;
	           	  laypage({
	           			cont : "page",
	           			pages : logs.body.pages,
	           			jump : function(obj,first){
	           				if(!first){
		           				logApp.$http.get('${ctx}/log/list.json?pageNum='+obj.curr).then(function(data){
		           					logApp.logList=data.body.list;
			                   }) 
	           				}
	           			}
	           	 })
          	 });
          })
       }
})

</script>
</html>